<template>
    <div>
        {{msg}} {{num}}
        <input type="text" v-model="msg">
        <br>
        <!--        <button @click="num&#45;&#45;">-</button>-->
        <button @click="sub">-</button>
        <input type="text" size="3" v-model="num">
        <!--        <button @click="num++">+</button>-->
        <button @click="add">+</button>
    </div>
</template>

<script>
    const data = {
        msg: 'abc',
        num: 10,
    }
    export default {
        name: "App",
        data() {
            return data
        },
        methods: {
            add() {
                this.num++;
            },
            sub() {
                this.num--;
            }
        }
    }
</script>

<style scoped>

</style>